import { BasicColumn, BasicTable, FormSchema, useTable } from "@/components/Table";
import { todoApi } from "@/api/bpm/task/todo/index";
import { Button } from "antd";
import { formatDate } from "@/utils/util";
import HandlingProcess from "./components/handlingProcess/index";
import { useDrawer } from "@/components/Drawer";
import { useTranslation } from "react-i18next";
const index = () => {
	const { t } = useTranslation();
	const en_vi = "task.todo";
	const columns: BasicColumn[] = [
		{
			title: t(`${en_vi}.processName`),
			render: (_, record) => {
				return record.processInstance.name;
			}
		},
		{
			title: t(`${en_vi}.promoter`),
			render: (_, record) => {
				return record.processInstance.startUser.nickname;
			}
		},
		{
			title: t(`${en_vi}.initiationTime`),
			dataIndex: "createTime",
			render: (time: any) => {
				return formatDate(new Date(time));
			}
		},
		{
			title: t(`${en_vi}.currentTask`),
			dataIndex: "name"
		},
		{
			title: t(`${en_vi}.taskTime`),
			dataIndex: "createTime",
			render: (time: any) => {
				return formatDate(new Date(time));
			}
		},
		{
			title: t(`${en_vi}.processNumber`),
			dataIndex: "processInstanceId"
		},
		{
			title: t(`${en_vi}.taskNumber`),
			dataIndex: "id"
		},
		{
			title: t(`${en_vi}.operate`),
			fixed: "right",
			render: (_, record) => {
				return (
					<div>
						<Button type="link" onClick={handle(record)}>
							{t(`${en_vi}.handle`)}
						</Button>
					</div>
				);
			}
		}
	];
	const schemas: FormSchema[] = [
		{
			field: "name",
			label: t(`${en_vi}.processName`),
			component: "Input"
		},
		{
			field: "time",
			label: t(`${en_vi}.creationTime`),
			component: "RangePicker"
		}
	];
	const [registerTable] = useTable({
		api: todoApi.taskTodoPage,
		columns,
		useSearchForm: true,
		formConfig: {
			labelWidth: 100,
			schemas,
			showActionButtonGroup: true,
			baseColProps: { span: 6 },
			actionColOptions: { span: 24 }
		},
		beforeFetch: params => {
			if (!params.time) return params;
			return { ...params, createTime: params.time + "" };
		},
		bordered: true
	});
	const [registerDrawer, { openDrawer }] = useDrawer();
	const handle = (record: any) => () => {
		openDrawer(true, {
			record,
			page: "todo"
		});
	};
	return (
		<div>
			<BasicTable register={registerTable}></BasicTable>
			<HandlingProcess register={registerDrawer}></HandlingProcess>
		</div>
	);
};
export default index;
